import React, { useRef } from "react";
import { InputNumber } from "antd";
import { useFormField } from "../../context/form-context";
import { formatNumber, isSafari, precisionFunc } from "../../utils";
import { useInject } from "../../context/inject-context";
import set from "lodash/set"
import  bignumber from 'bignumber.js'
// import BigNumber from "bignumber.js";

let defaultConfig = {
  //这一批属性来源 tplData.form.data_control （步骤权限）
  // "code": "a7",
  // "name": "数值",
  // "type": "number",
  // "is_show": true,
  // "is_editable": true,
  // "is_required": false,

  //这一批属性来源 tplData.form.form_meta_data （表单设计器）
  // "isUsed": false,
  // "designProps": {
  //   "code": "a7",
  //   "name": "数值",
  //   "ui": "wfd_number",
  //   "title": "数值",
  //   "layout": "control_layout_leftRight",
  //   "defaultValue": "",
  //   "currency": "",
  //   "digits": 0,
  //   "text": "请输入数值",
  //   "groupTitle": "",
  //   "byTableGroupTitle": false,
  //   "tipstext": "",
  //   "isTotal": false,
  //   "isChildren": false,
  //   "type": "number",
  //   "title_w": 85
  // },
  
  //这一批属性来源 tplData.form.data_define （业务对象）
  // "show_type": "",
  // "show_type_name": "",
  "props": {
    "precision": 2,
    // "is_thousandth": true,
    // "range": [
    //   "-99999999999",
    //   "99999999999"
    // ],
    // "source_type": "fixd_value",
    // "handle_null_value": "show_zero",
    // "configs": "",
    // "default_value": "",
    // "default_text": "",
    // "percentage": false
  },
  // "type_name": "数值",
  
  //来源 tplData.form.defaultValueConf
  // "default": null
}

export default function ({
  field,
  cell,
  //数值范围
  min = cell.props?.range?.[0]!==undefined  ? Number(cell.props?.range?.[0]) : -99999999999,
  max = cell.props?.range?.[1]!==undefined ? Number(cell.props?.range?.[1]) : 99999999999,
  label,
  rules = [
    {
      validator: (rule, value) => {
        const numberValue = Number(value);
        if (numberValue == NaN) return true;
        else {
          if (numberValue > max || numberValue < min) {
            return false;
          } else {
            return true;
          }
        }
      },
    },
  ],
  required,
  showLabel = true,
  displayFormatter,
  valueFormatter,
  onChange,
  onBlur,
  rowIndex,
  ...others
}) {

  //兼容异常数据，如果不存在小数位配置，则默认小数位是2位
  if(cell?.props?.precision === undefined){
    set(cell, "props.precision", defaultConfig.props.precision);
  }

  const fromBlurRef=useRef(false)

  const { input, property, validation, readonly, className, isDisplay } = useFormField({
    field,
    rules,
    onChange,
    displayFormatter,
    valueFormatter,
    onBlured:()=>{fromBlurRef.current=true},
  });
  // debugger
  const injectInfo = useInject();
  const precisionRef = useRef(cell?.props?.precision);

  //对数值进行百分比、千分位、小数位转换
  function getShowText(val) {
    return formatNumber(val, {
      percentage: cell?.props?.percentage, //百分比
      precision: cell?.props?.precision ? cell.props.precision : 0, //小数位
      is_thousandth: cell?.props?.is_thousandth, //千分位
      prefixStr: injectInfo?.prefixStr, //前缀
    }); //格式化千分位/小数位/百分比符号
  }
  //input.value = "-0.001"测试数据
  //初始化默认值
  if (input.value === null || input.value === undefined || input.value === "") {
    //字段没有值

    let handle_null_value = cell?.props?.handle_null_value;
    if (handle_null_value == "show_null") {
      //没有值显示为空
      input.value = "";
    } else if (handle_null_value == "show_zero") {
      //没有值显示为0
      input.value=0
    } else {
      //如果没有配置 PO让显示为0
      input.value = 0;
    }
  } else {
    //格式化小数位
    /*
      如果字段值是 0.1234
      配置的小数位是精度是2，则小数位对结果进行四舍五入为 -> 0.12
      如果配置了百分比，则显示值为12.00%
      精度是操作原始值，不操作显示值
    */
    var precision = 6; //小数位超过6位会导致出现科学计数 比如 0.0000001 为 1e-7
    //小数位适配
    if (cell.props && typeof cell.props?.precision !== "undefined" && Number(cell.props?.precision) >= 0) {
      precision = cell.props?.precision;
    }
    //如果是字符串类型的值，并且没有设置精度precision 需要判断字符串的精度
    if (cell.props?.precision === undefined && typeof input.value == "string" && ~input.value?.indexOf(".") && Number(input.value) !== null) {
      let numberParts = input.value.split(".");
      precision = numberParts[1].length;
      precisionRef.current = precision;
    }
  }

  if (isDisplay) {
    //只读模式
    return input.value === "" ? "" : getShowText(input.value);
  }

  //显示值
  const formatter = (value, options = {}) => {
    if (value === "") {
      return value;
    }
    let precision = precisionRef.current ? precisionRef.current : cell?.props?.precision ? cell.props.precision : 0; //小数位
    let doPrecisionFunc=!options.userTyping;//是否需要格式化小数位
    if(isSafari){
      if(fromBlurRef.current===true){
        fromBlurRef.current=false
        doPrecisionFunc=true;
      }
      else
      {
        doPrecisionFunc=false;//Safari浏览器下，inputNumber无法区分change blur事件，这里用来兼容Safari浏览器下，某些情况不需要做小数位格式化
      }
    }
    return formatNumber(value, {
      percentage: cell?.props?.percentage, //百分比
      precision: precision,
      is_thousandth: cell?.props?.is_thousandth, //千分位
      prefixStr: false, //前缀
      showPercentage: false,
      doPrecisionFunc:doPrecisionFunc ,
    });
  };
  //真实数据
  const parser = (value,options={}) => {
        
    if (value === "") {
      return value;
    }
    value = String(value).replace(/(,*)/g, "");
    if (cell.props?.percentage) {
      value = bignumber(value).div(100).toNumber();
    }

    if(fromBlurRef.current===true){
      fromBlurRef.current=false
      let precision = precisionRef.current ? precisionRef.current : cell?.props?.precision ? cell.props.precision : 0; //小数位
      value = precisionFunc(value, precision);
    }

   

    return value;
  };
  const component = (
    <InputNumber
      addonAfter={cell.props?.percentage === true ? "%" : undefined}
      min={min}
      controls={false}
      // precision={precisionRef.current?precisionRef.current:(cell.props?.precision || 0)}
      max={max}
      placeholder={cell?.designProps?.text ? cell?.designProps?.text : "请输入"}
      style={{ width: "100%" }}
      className={className}
      disabled={property.disabled}
      formatter={formatter}
      parser={parser}
      step={cell.props?.percentage === true ? 0.01 : 1}
      {...input}
      {...others}
      {...readonly}
    ></InputNumber>
  );

  return component;
}
